<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>public/admin/css/login.css">
    <script src="<?php echo base_url(); ?>public/admin/script/jquery-2.0.3.js" type="text/javascript"></script>
    <title> Login Admin </title>
</head>
<body>
<div class="content">
    <form method="post" name="login" id="login">
        <div class="box">
            <div id="box-login"><img src="<?php echo base_url(); ?>public/admin/images/login/headerbox.png" width="250px"/></div><br/>
            <h1>Username: </h1>
            <h2><input type="text" name="username" id="username" autocomplete="off" autofocus="true"/></h2>
            <h1>Password: </h1>
            <h2><input type="password" name="password" id="password" autocomplete="off"/></h2>
            <?php

            if($error != ""){
                echo '<p id="note">'.$error.'</p>';

            }else{
                echo '<p id="note" hidden="hidden"></p>';
            }
            ?>

            <div id="box-connect"></div>
        </div>
    </form>
</div>
<script>

    $(function(){
        //Validate form input
        $('#box-connect').click(function(){
            var username = document.getElementById('username').value;
            var password = document.getElementById('password').value;
            note = $('#note');
            note.hide();
            if(username == ""){
                note.text("Chưa nhập username");
                note.show();
            }else if(password == ""){
                note.text("Chưa nhập password");
                note.show();
            }else{
                $('#login').submit();
            }
        });
        //Enter event
        $('input').keypress(function(event){
            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == 13){
                var username = document.getElementById('username').value;
                var password = document.getElementById('password').value;
                note = $('#note');
                note.hide();
                if(username == ""){
                    note.text("Chưa nhập username");
                    note.show();
                }else if(password == ""){
                    note.text("Chưa nhập password");
                    note.show();
                }else{
                    $('#login').submit();
                }
            }
        });

    });
</script>
</body>
</html>